|
1
|
|
|
import React from "react" |
|
2
|
|
|
import type { ClassNames, ClassNamesProperty, ClassHash } from "." |
|
3
|
|
|
import { classNamesCheck } from "./check" |
|
4
|
|
|
|
|
5
|
|
|
import css from "./some.css" |
|
6
|
|
|
import module from "./some.module.css" |
|
7
|
|
|
const module_css: typeof module = { |
|
8
|
|
|
"class1": "hash1", |
|
9
|
|
|
"class2": "hash2" |
|
10
|
|
|
} |
|
11
|
|
|
|
|
12
|
|
|
function App(_: ClassNames<ClassNamesProperty<{class1: ClassHash; class2: ClassHash}>>) { return null } |
|
13
|
|
|
function Component(_: ClassNames<ClassNamesProperty<{class1: ClassHash}>>) { return null } |
|
14
|
|
|
|
|
15
|
|
|
it("without", () => { |
|
16
|
|
|
//@ts-expect-error |
|
17
|
|
|
<App classnames={css} />; |
|
18
|
|
|
<App classnames={module_css} />; |
|
19
|
|
|
<Component classnames={module_css} />; |
|
20
|
|
|
}) |
|
21
|
|
|
|
|
22
|
|
|
it("declares", () => { |
|
23
|
|
|
<App classnames={classNamesCheck()} />; |
|
24
|
|
|
|
|
25
|
|
|
<App |
|
26
|
|
|
//@ts-expect-error Property 'class2' is missing |
|
27
|
|
|
classnames={ |
|
28
|
|
|
classNamesCheck<ClassNamesProperty<{Class1: ClassHash}>>() } />; |
|
29
|
|
|
|
|
30
|
|
|
<App |
|
31
|
|
|
//@ts-expect-error Property 'class2' is missing |
|
32
|
|
|
classnames={ |
|
33
|
|
|
classNamesCheck<typeof Component>()} />; |
|
34
|
|
|
|
|
35
|
|
|
expect(true).toBe(true) |
|
36
|
|
|
}) |
|
37
|
|
|
|
|
38
|
|
|
it("propagates", () => { |
|
39
|
|
|
//@ts-expect-error |
|
40
|
|
|
<App classnames={classNamesCheck(css)} />; |
|
41
|
|
|
|
|
42
|
|
|
<Component classnames={classNamesCheck(module_css)} />; |
|
43
|
|
|
|
|
44
|
|
|
<App classnames={classNamesCheck(module_css)} />; |
|
45
|
|
|
|
|
46
|
|
|
<App |
|
47
|
|
|
//@ts-expect-error Property 'class2' is missing |
|
48
|
|
|
classnames={ |
|
49
|
|
|
classNamesCheck({class1: undefined})} />; |
|
50
|
|
|
}) |
|
51
|
|
|
|
|
52
|
|
|
it("equility if possible", () => { |
|
53
|
|
|
<App classnames={classNamesCheck<typeof App>(css)} />; |
|
54
|
|
|
|
|
55
|
|
|
<App classnames={classNamesCheck<typeof App>(module_css)} />; |
|
56
|
|
|
|
|
57
|
|
|
<App |
|
58
|
|
|
//@ts-expect-error is not assignable |
|
59
|
|
|
classnames={ |
|
60
|
|
|
classNamesCheck<typeof Component>(css)} />; |
|
61
|
|
|
|
|
62
|
|
|
<App |
|
63
|
|
|
//@ts-expect-error is not assignable |
|
64
|
|
|
classnames={ |
|
65
|
|
|
classNamesCheck<typeof Component>(module_css)} />; |
|
66
|
|
|
|
|
67
|
|
|
classNamesCheck<typeof Component>({class1: "undefined", |
|
68
|
|
|
//TODO @ts-expect-error Object literal may only specify known properties, but 'class2' does not exist |
|
69
|
|
|
class2: "undefined"}); |
|
70
|
|
|
//TODO //@ts-expect-error |
|
71
|
|
|
classNamesCheck<typeof Component, typeof module_css>(module_css); |
|
72
|
|
|
|
|
73
|
|
|
//@ts-expect-error |
|
74
|
|
|
<App classnames={classNamesCheck<typeof App, typeof css>(css)} />; |
|
75
|
|
|
|
|
76
|
|
|
<Component classnames={classNamesCheck<typeof App, typeof module_css>(module_css)} /> ; |
|
77
|
|
|
|
|
78
|
|
|
//@ts-expect-error Property 'class1' is missing in type '"class2"[]' |
|
79
|
|
|
<Component classnames={classNamesCheck<typeof Component, typeof module_css>(module_css)} /> ; |
|
80
|
|
|
//@ts-expect-error Property 'class1' is missing in type '"class2"[]' |
|
81
|
|
|
<Component classnames={classNamesCheck<typeof Component, typeof module_css>()} /> ; |
|
82
|
|
|
|
|
83
|
|
|
expect(true).toBe(true) |
|
84
|
|
|
}) |
askirmas /
react-classnaming
